<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org "
 	  xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head th:include="common::common(title='Welcome')"></head>
<link rel="stylesheet" th:href="@{/assets/css/home.css?v=3}">
<script type="text/javascript" th:src="@{/js/home.js?v=3}"></script>
<body>
<div id="layout" style="height:100%;" v-cloak>

	<el-container style="height:100%;">
	
		<el-aside :width="asideWidth" style="background:#545c64;color:white;">
		
			<el-scrollbar wrap-class="wrap_class" :native="false">
			
				<div class="middle_container">
					<div class="company_info">
						<div class="company_info_title">
							&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;九牧农场
						</div>
					</div>
				</div>
				
				<el-menu default-active="0" 
						 background-color="#545c64"
						 unique-opened="true"
						 text-color="#c3c3c3"
						 active-text-color="#ffffff"
						 :collapse="isCollapse">
					
					<el-submenu v-for="(item,index) in menuList" :index="index" >
					
					   <template slot="title">
					      <i :class="item.imgName?item.imgName:'el-icon-location'"></i>
					      <span slot="title">{{item.name}}</span>
					    </template>
					    
					  	<el-menu-item-group v-for="(child,childIndex) in item.childs">
						    <el-menu-item :index="index+'-'+childIndex" @click="clickMenu(child)">
						    	{{child.name}}
						    </el-menu-item>
      				   	</el-menu-item-group>
      				   	
					</el-submenu>
					
			    </el-menu>
		    </el-scrollbar>
		</el-aside>
		
		<el-container>
		
			<el-header style="padding:0;" height="0.9rem">
				<el-row>
					<el-col>
						<div class="myheader">
							<span><img th:src="@{/assets/images/home/header.png}"></span>
							<span sec:authentication="principal.nickName" style="color:#333333;font-weight: 400;"></span>
							<span class="splitLine">&nbsp;</span>
							<span><a @click="updatePassword" style="color:#666666">修改密码</a></span>
							<span><a @click="logout" class="logout">&nbsp;退出</a></span>
						</div>
					</el-col>
				</el-row>
			</el-header>
			
			<el-main style="padding:0.2rem 0.2rem 0 0.2rem;background-color:#f2f2f2;overflow: hidden;height:100%">
			
				<el-tabs v-model="selectedTab" type="border-card" @tab-remove="removeTab" style="height:100%;">
				  <el-tab-pane  v-for="(item, index) in tabs"
							    :key="item.name"
							    :label="item.title"
							    :name="item.name"
							    lazy
							    :closable="item.closable">
							    
				  	<span slot="label" @contextmenu.prevent="contextmenu">{{item.title}}</span>
				  	
				    <iframe :src='item.content' frameborder="0" scrolling="yes"></iframe>
				    
				  </el-tab-pane>
				</el-tabs>
			</el-main>
		</el-container>
			
	</el-container>
</div>
</body>
</html>